<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Performance Test</title>
    <link href="layout.css" rel="stylesheet" type="text/css"></link>
    <!--[if IE]><script language="javascript" type="text/javascript" src="js/excanvas.js"></script><![endif]-->
    <script language="javascript" type="text/javascript" src="js/jquery-1.2.6.js"></script>
    <script language="javascript" type="text/javascript" src="js/jquery.flot.js"></script>
	<script language="JavaScript">
		function test() {
			var begin = new Date().getTime();
			var type = document.forms[0].type.value;
			var data1 = document.forms[0].data1.value;
			var data2 = document.forms[0].data2.value;
			var arr = [];
			for (var i = 0; i < data1; i++) {
				var data = [];
				for (var j = 0; j < data2; j++) {
					data.push([j, i]);
				}
				var ddd;
				if (type == "line") {
					ddd = {
						label: "name" + i, 
						data: data,
						lines: {show: true, fill: false }
					};
				} else if (type == "bar") {
					ddd = {
						label: "name" + i, 
						data: data,
						bars: {show: true}
					};
				} else {
					ddd = {
						label: "name" + i, 
						data: data,
						points: {show: true}
					};
				}
				
				arr[i] = ddd;
			}
			$.plot($("#placeholder"), arr);
			var end = new Date().getTime();
			document.forms[0].time.value = end - begin;
			
		}
	</script>
 </head>
    <body>
    <h3>Performance Test</h3>
	<form id="myform">
		<table>
			<tr>
				<td>Type:</td>
				<td>
					<select id="type" name="type">
						<option value="line">line</option>
						<option value="bar">bar</option>
						<option value="point">point</option>
					</select>
				</td>
			</tr>
			<tr>
				<td>Data1:</td>
				<td><input id="data1" name="data1" value="10"/></td>
			</tr>
			<tr>
				<td>Data2:</td>
				<td><input id="data2" name="data2" value="10"/></td>
			</tr>
			<tr>
				<td>Time:</td>
				<td><input id="time" name="time" value="" readonly="true"/> ms</td>
			</tr>
		</table>
		<input type="button" value="test" onclick="test()"/>
	</form>
	<div id="placeholder" style="width:600px;height:300px;"></div>
 </body>
</html>

